/**
 * Created by lonntec on 2016/3/1.
 */
(function($){
    $.fn.listbox = function(opt,data){
        if(typeof opt == "string"){
            return $.fn.listbox.methods[opt](this, data);
        }
        opt = opt || {};
        return this.each(function(){
            var _data = $.data(this,"listbox");
            if(_data){
                $.extend(_data.options,opt);
            }else{
                $.data(this,"listbox",{
                    options: $.extend({}, $.fn.listbox.defaults, $.fn.listbox.parseOptions(this),opt)
                });
                renderList(this);
            }
        });
    };
    $.fn.listbox.methods = {};
    $.fn.listbox.parseOptions = function(obj){
        var t = $(obj);
        return $.extend({},
            $.parser.parseOptions(obj)
        );
    };
    $.fn.listbox.defaults = {
        url: null,
        moveTitle: null,
        showTitle: null,
        queryParams:{}
    };
    //渲染整个listbox结构
    function renderList(obj){
        var _obj = $(obj);
        var _opt = $.data(obj,"listbox").options;
        _opt.name = _obj.attr("id");
        if(!_opt.url){
            _opt.listData = getData(_opt);
        }else{return;}
        _opt.data = new Array();
        _opt.selectData = new Array();
        _opt.inValue = new Array();
        _opt.outValue = new Array();
        for(var x in _opt.listData){
            _opt.data.push(_opt.listData[x]);
        }

        _opt.list_container = $("<div />",{class:"bootstrap-duallistbox-container row moveonselect"}).appendTo(_obj);

        _opt.move_select = $("<div />",{class:"col-md-6"}).appendTo(_opt.list_container);
        if(_opt.moveTitle){
            _opt.move_title = $("<span />",{class:"info-container"}).appendTo(_opt.move_select);
            $("<span />",{class:"info"}).appendTo(_opt.move_title).text(_opt.moveTitle);
        }
        _opt.move_input = $("<input />",{class:"filter as-form-control",type:"text"}).appendTo(_opt.move_select);
        _opt.move_input.bind("keyup",{target:_opt.move_input,option:_opt},searchOpt);

        _opt.move_btn_container = $("<div />",{class:"btn-group buttons"}).appendTo(_opt.move_select);
        _opt.move_btn = $("<button />",{type:"button",class:"btn moveall btn-default"}).appendTo(_opt.move_btn_container).text('>>');
        _opt.move_btn.bind("click",{target:_opt.move_btn,option:_opt},btnEvent);

        _opt.select = $("<select />",{class:"as-form-control",multiple:"multiple"}).appendTo(_opt.move_select);
        if(_opt.listData){
            for(var i in _opt.listData){
                _opt.select_option = $("<option />",{value:_opt.listData[i]}).appendTo(_opt.select).text(_opt.listData[i]);
                _opt.select_option.bind("click",{target:_opt.select_option,option:_opt},moveEvent)
            }
        }
        _opt.have_select = $("<div />",{class:"col-md-6"}).appendTo(_opt.list_container);
        if(_opt.showTitle){
            _opt.show_title = $("<span />",{class:"info-container"}).appendTo(_opt.have_select);
            $("<span />",{class:"info"}).appendTo(_opt.show_title).text(_opt.showTitle);
        }
        _opt.have_input = $("<input />",{class:"filter as-form-control",type:"text"}).appendTo(_opt.have_select);
        _opt.have_input.bind("keyup",{target:_opt.have_input,option:_opt},searchOpt);
        _opt.have_btn_container = $("<div />",{class:"btn-group buttons"}).appendTo(_opt.have_select);
        _opt.have_btn = $("<button />",{type:"button",class:"btn moveall btn-default"}).appendTo(_opt.have_btn_container).text('<<');
        _opt.have_btn.bind("click",{target:_opt.have_btn,option:_opt},btnEvent);

        _opt.selected = $("<select />",{class:"as-form-control",multiple:"multiple",name:_opt.name}).appendTo(_opt.have_select);


    }
    //ajax获取选项数据
    function getData(opt){
        var listJson = {fname:"John",lname:"Doe",age:"123"};
        //$.ajax({
        //    type: 'post',
        //    async: false,
        //    url: opt.url,
        //    data: opt.queryParams,
        //    dataType: 'json',
        //    success: function(data){
        //        listJson = data;
        //    },
        //    error:function(){
        //        alert('数据加载失败！');
        //    }
        //});
        return listJson;
    }

    //单个选中事件
    function moveEvent(e){
        var select_option = e.data.target;
        var opt = e.data.option;
        var value = select_option.attr("value");
        var list = select_option.parent().parent();
        switch (list.next(".col-md-6").length){
            case 0 :
                opt.select_option = $("<option />",{value:value}).appendTo(list.prev(".col-md-6").children("select")).text(value);
                opt.data.push(value);
                opt.selectData = $.grep(opt.selectData,function(n,i){
                    return n != value;
                });
                break;
            case 1 :
                opt.select_option = $("<option />",{value:value}).appendTo(list.next(".col-md-6").children("select")).text(value);
                opt.data = $.grep(opt.data,function(n,i){
                    return n != value;
                });
                opt.selectData.push(value);
                break;
        }
        opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent);
        select_option.remove();
    }

    //全部选中事件
    function btnEvent(e){
        var btn = e.data.target;
        var opt = e.data.option;
        var list = btn.parent().parent();
        var options = btn.parent().next("select").children("option");
        if(options.length == 0){return;}
        switch (list.next(".col-md-6").length){
            case 0 :
                var select1 = list.prev(".col-md-6").children("select");
                select1.children("option").remove();
                if(opt.inValue.length > 0){
                    opt.selectData = opt.outValue;
                    for(var a=0;a<opt.inValue.length;a++){
                        opt.data.push(opt.inValue[a]);
                    }
                }else{
                    for(var b=0;b<opt.selectData.length;b++){
                        opt.data.push(opt.selectData[b]);
                    }
                    opt.selectData = [];
                }
                for(var i=0;i<opt.data.length;i++){
                    opt.select_option = $("<option />",{value:opt.data[i]}).appendTo(select1).text(opt.data[i]);
                    opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent)
                }
                break;
            case 1 :
                var select2 = list.next(".col-md-6").children("select");
                select2.children("option").remove();
                if(opt.inValue.length > 0){
                    opt.data = opt.outValue;
                    for(var a=0;a<opt.inValue.length;a++){
                        opt.selectData.push(opt.inValue[a]);
                    }
                }else{
                    for(var b=0;b<opt.data.length;b++){
                        opt.selectData.push(opt.data[b]);
                    }
                    opt.data = [];
                }
                for(var i=0;i<opt.selectData.length;i++){
                    opt.select_option = $("<option />",{value:opt.selectData[i]}).appendTo(select2).text(opt.selectData[i]);
                    opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent)
                }
                break;
        }
        options.remove();
    }

    //搜索选项事件
    function searchOpt(e){
        var input = e.data.target;
        var opt = e.data.option;
        var value = $.trim(input.val());
        opt.inValue = [];
        opt.outValue = [];
        var options = input.siblings("select").children("option");
        switch (input.parent().next(".col-md-6").length){
            case 0 :
                var data = opt.selectData;
                break;
            case 1 :
                var data = opt.data;
                break;
        }
        if(value){
            for(var i=0;i<data.length;i++){
                var a = data[i];
                var result = a.toLowerCase().lastIndexOf(value.toLowerCase());
                if(result > -1){
                    opt.inValue.push(data[i]);
                }else{
                    opt.outValue.push(data[i]);
                }
            }
            options.remove();
            for(var j=0;j<opt.inValue.length;j++){
                opt.select_option = $("<option />",{value:opt.inValue[j]}).appendTo(input.siblings("select")).text(opt.inValue[j]);
                opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent);
            }
        }else {
            if(data.length != options.length){
                options.remove();
                for(var a=0;a<data.length;a++){
                    opt.select_option = $("<option />",{value:data[a]}).appendTo(input.siblings("select")).text(data[a]);
                    opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent);
                }
            }
        }
    }
    //function searchOut(e){
    //    var input = e.data.target;
    //    var opt = e.data.option;
    //    clearTimeout(opt.number);
    //    var options = input.siblings("select").children("option");
    //    opt.selectValue = new Array();
    //    var data = new Array();
    //    var select_options = input.parent().next(".col-md-6").children("select").children("option");
    //
    //    for(var b=0;b<select_options.length;b++){
    //        opt.selectValue.push($(select_options[b]).attr("value"));
    //    }
    //    for(var x in opt.listData) {
    //        data.push(opt.listData[x]);
    //    }
    //    if(data.length != options.length){
    //        options.remove();
    //        for(var i=0;i<data.length;i++){
    //            if(opt.selectValue.length > 0){
    //                for(var a=0;a<opt.selectValue.length;a++){
    //                    if(data[i] != opt.selectValue[a]){
    //                        opt.select_option = $("<option />",{value:data[i]}).appendTo(input.siblings("select")).text(data[i]);
    //                        opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent);
    //                    }
    //                }
    //            }else{
    //                opt.select_option = $("<option />",{value:data[i]}).appendTo(input.siblings("select")).text(data[i]);
    //                opt.select_option.bind("click",{target:opt.select_option,option:opt},moveEvent);
    //            }
    //        }
    //        input.val('');
    //
    //    }
    //
    //
    //}



})(jQuery);